<<<<<<< HEAD
<!--
 * @Author: Xia_cc 978487464@qq.com
 * @Date: 2022-06-08 14:23:53
 * @LastEditors: Xia_cc 978487464@qq.com
 * @LastEditTime: 2022-06-08 16:37:36
 * @FilePath: \vue 小U到家\src\views\Fristweb.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<!--  -->
<template>
  <el-container>
    <el-header></el-header>
    <el-main id="big">
      <div id="zd">
        <span class="el-icon-location-outline"></span> 当前站点数量：<span class="font">{{
          zhandainNum
        }}</span>
      </div>
      <div id="dd">
        <span class="el-icon-edit-outline"></span> 当前订单数量：<span class="font">{{
          dingdanNum
        }}</span>
      </div>
      <div id="psy">
        <span class="el-icon-user"></span> 当前配送员数量：<span class="font">{{
          peisongyuanNum
        }}</span>
      </div>
      <div id="yh">
        <span class="el-icon-mobile-phone"></span> 当前用户数量：<span class="font">{{
          yonghuNum
        }}</span>
      </div>
    </el-main>
  </el-container>
</template>

<script>
export default {
  name: "Fristweb",
  components: {},
  computed: {},
  data() {
    return {
      zhandainNum: "",
      dingdanNum: "",
      peisongyuanNum: "",
      yonghuNum: "",
    };
  },
  methods: {
    fireWeb() {
      this.$axios({
        method: "post",
        url: "/xiaoucomeshome_war/admin/firstPage",
      })
        .then((res) => {
          console.log(res.data);
          this.zhandainNum = res.data.data.countSite;
          this.dingdanNum = res.data.data.countOrder;
          this.peisongyuanNum = res.data.data.countCourier;
          this.yonghuNum = res.data.data.countUser;
        })
        .catch((err) => {
          console.log(err);
        });
    },
  },
  mounted() {
    this.fireWeb();
    // console.log(this.tabledata);
  },
};
</script>

<style lang="less" scoped>
#big {
  overflow: hidden;
  width: 100%;
  text-align: center;
  .font {
    font-size: 30px;
  }
  div {
    width: 21%;
    margin: 2%;
    height: 200px;
    float: left;
    border-radius: 10px;
    color: aliceblue;
    font-size: 20px;
    line-height: 200px;
  }
  #zd {
    background-color: #409eff;
  }
  #dd {
    background-color: #67c23a;
  }
  #psy {
    background-color: #e6a23c;
  }
  #yh {
    background-color: #f56c6c;
  }
}
</style>
=======
<!--
 * @Author: Xia_cc 978487464@qq.com
 * @Date: 2022-06-08 14:23:53
 * @LastEditors: Xia_cc 978487464@qq.com
 * @LastEditTime: 2022-06-08 16:37:36
 * @FilePath: \vue 小U到家\src\views\Fristweb.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<!--  -->
<template>
  <el-container>
    <el-header></el-header>
    <el-main id="big">
      <div id="zd">
        <span class="el-icon-location-outline"></span> 当前站点数量：<span class="font">{{
          zhandainNum
        }}</span>
      </div>
      <div id="dd">
        <span class="el-icon-edit-outline"></span> 当前订单数量：<span class="font">{{
          dingdanNum
        }}</span>
      </div>
      <div id="psy">
        <span class="el-icon-user"></span> 当前配送员数量：<span class="font">{{
          peisongyuanNum
        }}</span>
      </div>
      <div id="yh">
        <span class="el-icon-mobile-phone"></span> 当前用户数量：<span class="font">{{
          yonghuNum
        }}</span>
      </div>
    </el-main>
  </el-container>
</template>

<script>
export default {
  name: "Fristweb",
  components: {},
  computed: {},
  data() {
    return {
      zhandainNum: "",
      dingdanNum: "",
      peisongyuanNum: "",
      yonghuNum: "",
    };
  },
  methods: {
    fireWeb() {
      this.$axios({
        method: "post",
        url: "/xiaoucomeshome_war/admin/firstPage",
      })
        .then((res) => {
          console.log(res.data);
          this.zhandainNum = res.data.data.countSite;
          this.dingdanNum = res.data.data.countOrder;
          this.peisongyuanNum = res.data.data.countCourier;
          this.yonghuNum = res.data.data.countUser;
        })
        .catch((err) => {
          console.log(err);
        });
    },
  },
  mounted() {
    this.fireWeb();
    console.log(this.tabledata);
  },
};
</script>

<style lang="less" scoped>
#big {
  overflow: hidden;
  width: 100%;
  text-align: center;
  .font {
    font-size: 30px;
  }
  div {
    width: 21%;
    margin: 2%;
    height: 200px;
    float: left;
    border-radius: 10px;
    color: aliceblue;
    font-size: 20px;
    line-height: 200px;
  }
  #zd {
    background-color: #409eff;
  }
  #dd {
    background-color: #67c23a;
  }
  #psy {
    background-color: #e6a23c;
  }
  #yh {
    background-color: #f56c6c;
  }
}
</style>
>>>>>>> ae27e4fe2d4f939d0b0ee2bfa506b9e3269c53cb
